<template>
  <div>
      <a-card>
      <a-form-model :model="queryParam" v-bind="layout">
        <a-row>
          <a-col :xs="24" :sm="24" :md="18" :lg="12" :xl="8" :xxl="8">
            <a-form-model-item>
              <div class="sch">
                <a-input v-model="queryParam.query" />
                <a-button type="primary" class="search" @click="search"
                  >搜索</a-button
                >
                <!-- <a-button type="primary" @click="addUser">添加</a-button> -->
              </div>
            </a-form-model-item>
          </a-col>
          <a-col :xs="24" :sm="24" :md="18" :lg="12" :xl="8" :xxl="8"> </a-col>
        </a-row>
      </a-form-model>
      <a-table
        :rowKey="(record) => record.goods_id"
        :columns="columns"
        :data-source="goodData.goodsList"
        :pagination="pagination"
        @change="handleTableChange"
        bordered
      >
        <span slot="action" slot-scope="text, record">
          <span class="edit" @click="editUser(record)">修改</span>
          <a-divider type="vertical"></a-divider>
          <span class="del" @click="delUser(record)">删除</span>
        </span>
      </a-table>
      </a-card>
  </div>
</template>

<script>
import {getGoodsList} from '@/network/list'
export default {
    components:{},
    data(){
        return{
            queryParam:{
                query: "",
                pagenum: 1,
                pagesize: 5,
            },
            goodsList:[],
            layout: {
        labelCol: { span: 6 },
        wrapperCol: { span: 15 },
      },
      goodData:{
          goodsList:[],
          total:0
      },
        pagination: {
        total: 0,
        current: 1,
        pageSize: 5,
        showSizeChanger: true,
        pageSizeOptions: ["5", "10", "15", "20", "25"],
      },
      columns: [
        {
          title: "序号",
          customRender: (text, record, index) => {
            return (
              this.pagination.pageSize * (this.pagination.current - 1) + index + 1
            );
          },
          align: "center",
        },
        {
          title: "商品名称",
          dataIndex: "goods_name",
          align: "center",
        },
        {
          title: "价格",
          dataIndex: "goods_price",
          align: "center",
        },
        {
          title: "商品数量",
          dataIndex: "goods_number",
          align: "center",
        },
        {
          title: "商品重量",
          dataIndex: "goods_weight",
          align: "center",
        },
        // {
        //   title: "创建时间",
        //   dataIndex: "goods_price",
        //   align: "center",
        // },
      ]
        }
    },
    created(){
        this.getGoodsList()
    },
    methods:{
        getGoodsList(){
            const params={
                query:this.queryParam.query,
                pagenum: this.pagination.current,
                pagesize: this.pagination.pageSize,

            }
            getGoodsList(params).then(
                res =>{
                    this.goodData.goodsList=res.data.goods
                    this.pagination.total = res.data.total
                }
            )
        },
        handleTableChange(pagination) {
            this.pagination = pagination;
            this.getGoodsList();
    },
    search() {
      this.getGoodsList();
    },
    }
}
</script>

<style lang="less" scoped>
.sch {
  display: flex;
}
.search {
  margin-left: 10px;
  margin-right: 10px;
}
</style>